<template>
	<div class="zhengtuojianhuo">
		<van-nav-bar :fixed="true" class="navBar" title="静态补货" left-arrow @click-left="$router.go(-1)"></van-nav-bar>


			<div class="goodsFromWarp" style="margin-top:0px; padding-top:0px;">
					<div class="goodsInputWarp">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">工作位置：</div>
							</div>


							<div class="skuNoInput">
								{{editForm.hqp}}
							</div>


							<div class="searchBtn">
								<button :disabled="isdisabled"  @click.stop="_getWeizhi()" >
									<van-icon name="ellipsis" color="#1989fa"  />
								</button>
							</div>
					</div>


					<div class="content">
						<span class="xian"></span>
						<span class="label">波次单号：</span>
						<span class="value">{{editForm.bill}}</span>
					</div>

					<div class="content">
						<span class="value">{{lingquData[0].cwno >''?'从':''}} {{lingquData[0].cwno}} {{lingquData[0].cwno >''?'补':''}} 	{{lingquData[0].itemid}} {{lingquData[0].cwno >''?'箱装：':''}} {{lingquData[0].unit}} {{skuData[index].username}}</span>
					</div>


					<div class="content">
						 {{lingquData[0].cwno >''?'未完成：':''}}
						<span v-if="lingquData[0].cwno >'' " class="value">{{lingquData.length}}</span>
					</div>

          <div class="content" style="font-size:16px;">
            {{skuData[index].ret_mess}}
					</div>


					<div class="chongfu">
							{{lingquData[0].cwno >''?'拣选仓位：':''}}
							<span v-if="lingquData[0].cwno >'' " class="value">	{{skuData[index].jxcwno}}</span>
							{{lingquData[0].cwno >''?'需补货：':''}}
							<span v-if="lingquData[0].cwno >'' " class="value">{{editForm.tqty}} {{skuData[index].username}}</span>
					</div>


					<div class="goodsInputWarp" style="margin-top:0px;">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">商品名称：</div>
							</div>


							<div class="skuNoInput">
								{{skuData[index].subsname}}
							</div>
					</div>

					<div class="goodsInputWarp">
							<div class="goodsInputLabel">
								<div class="goodsInputBorder"></div>
								<div class="skuName">编码：</div>
							</div>


							<div class="skuNoInput">
								{{editForm.itemid}}
							</div>
					</div>

			</div>


		<div class="goodsFromWarp" style="margin-top:0px; padding-top:0px;">
				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">件数：</div>
						</div>

						<van-field
							class="skuInput"
							clearable
							v-model="editForm.pack"
							placeholder="请输入件数"
						 />
				</div>

				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">散数：</div>
						</div>

						<van-field
							 class="skuInput"
							  clearable
							 v-model="editForm.qty"
							 placeholder="请输入散数"
						 />
				</div>




				<div class="goodsInputWarp">
						<div class="goodsInputLabel">
							<div class="goodsInputBorder"></div>
							<div class="skuName">目标仓位：</div>
						</div>

						<van-field
							 ref="inputField"
							 class="skuInput"
							 @keyup="onEnter($event,do_inputspbar)"
							 v-model="editForm.cwno_t"
							 placeholder="请输入目标仓位"
						 />
				</div>


        <!-- <div class="ret_mess">
          {{skuData[index].ret_mess}}
        </div> -->
		</div>


		<div class="skuBtn">
			<van-button type="info" :disabled="isdisabled" @click="lingquBtn()">领取任务</van-button>
			<van-button type="info" :disabled="!editForm.cwno_t >'' " @click="saveGoodsBtn()">确认</van-button>
		</div>




    <!-- 仓位列表 -->
		<van-overlay :show="isLingQuVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="仓位列表" left-arrow @click-left="isLingQuVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in lingquData" :key="i" class="danjuRow"  @click="lingquClick(row)">
								<van-row class="skuList">
								  <van-col span="24"> <span>任务号：</span> {{row.bill}}</van-col>
								</van-row>

								<van-row class="skuList" >
								  <van-col span="24"> <span>仓位：</span> {{row.cwno}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>拼接仓位：</span> {{row.cwnop}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>仓位顺序号：</span> {{row.route_c}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>集货位：</span> {{row.wno}}</van-col>
									<van-col span="12"> <span>仓库：</span> {{row.whsid}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>区：</span> {{row.q_no}}</van-col>
									<van-col span="12"> <span>排：</span> {{row.p_no}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>出货总量：</span> {{row.yjtotqty}}</van-col>
									<van-col span="12"> <span>托盘总量：</span> {{row.tqty}}</van-col>
								</van-row>

							</div>
					</div>
			</div>
		</van-overlay>

    <!-- 商品列表 -->
		<van-overlay :show="isSkuVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="商品列表" left-arrow @click-left="isSkuVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in skuData" :key="i" class="danjuRow" @click="selectSkuClick(row)" >
								<van-row class="skuList">
								  <van-col span="24"> <span>商品名称：</span> {{row.subsname}}</van-col>
								</van-row>

								<van-row class="skuList" >
								  <van-col span="24"> <span>单位：</span> {{row.username}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="12"> <span>库存量：</span> {{row.tkc}}</van-col>
									<van-col span="12"> <span>已分配量：</span> {{row.tkcfp}}</van-col>
								</van-row>
							</div>
					</div>
			</div>
		</van-overlay>

    <!-- 位置选择 -->
		<van-overlay :show="isHQVisible" :lock-scroll="false">
			<div class="shipandanWrapper">
					<van-sticky>
						<van-nav-bar class="navBar" title="位置选择" left-arrow @click-left="isHQVisible = false"></van-nav-bar>
					</van-sticky>
					<div class="shipandanCon" @click.stop>
							<div  v-for="(row,i) in hqpList" :key="i" class="danjuRow" @click="selectWeiZhiClick(row)" >
								<van-row class="skuList">
								  <van-col span="24"> <span>货区排：</span> {{row.hqp}}</van-col>
								</van-row>

								<van-row class="skuList" >
								  <van-col span="24"> <span>七层总数：</span> {{row.qczs}}</van-col>
								</van-row>

								<van-row class="skuList" >
								  <van-col span="24"> <span>四层：</span> {{row.sc}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>仓位自：</span> {{row.cwnof}}</van-col>
								</van-row>

								<van-row class="skuList"  >
									<van-col span="24"> <span>仓位止：</span> {{row.cwnot}}</van-col>
								</van-row>
							</div>
					</div>
			</div>
		</van-overlay>




	</div>
</template>

<script>

export default {
  name: 'jingtaibuhuo',
  data() {
    return {
			editForm:{
				hqp:'',  //货区排
				bill:'', //波次单号
				cwno:'', //任务号
				p_no:'', //排
				pack:'', //件数
				q_no:'', //区
				qty: '', //散数
				route_c:'', //仓位顺序号
				sort1:'', //仓位自
				storeid:'', //仓库id
				tqty:'', //出货总量
				whsid:'', //仓库id
				yjtotqty:'', //出货总量
				cwno_t:'', //目标仓位
			},
			isdisabled:false,  //是否禁用
			lingquData:[
				{
					bill: "",  //波次单号
					c_no: "",  //任务号
					cwno: "",  //任务号
					itemid: "",  //编码
					p_no: "",  //排
					pack: "",  //件数
					q_no: "",  //区
					qty: "", //散数
					route_c: "", //仓位顺序号
					sort1: "", //仓位自
					storeid: "", //仓库id
					subid: "", //编码
					tqty: "", //出货总量
					unit: "", //单位
					whsid: "", //仓库id
					yjtotqty: "",
				}
			],
			isLingQuVisible:false,  //是否显示仓位列表
			skuData:[
				{
					subsname:'', //商品名称
				}
			],
			isSkuVisible:false,  //是否显示商品列表
			isHQVisible:false,  //是否显示位置选择
			index:0,  //当前索引
			hqpList:[],  //货区排列表
			indexSku:0,  //商品列表索引
		};
  },
	computed: {
	   ryuser: function(){
	     return this.GWO(true).gUSER;  //获取用户信息
	   }
	},
  methods: {
		selectWeiZhiClick(row){
				this.editForm.p_no = row.p_no  //排
				this.editForm.q_no = row.q_no  //区
				this.editForm.hqp = row.hqp  //货区排
				this.isHQVisible = false  //关闭位置选择
		},
		_selectSku(){
			if(this.skuData[0].subsname >''){
					this.isSkuVisible = true  //显示商品列表
			}
		},
		shangClick(){
			if(this.index == 0){  //如果当前索引为0
				alert('最前一条')  //提示最前一条
			}else{
				this.index --  //当前索引减1
			}
		},
		xiaClick(){
			if(this.index ==  this.skuData.length-1){  //如果当前索引为商品列表长度-1
				alert('最后一条')  //提示最后一条
			}else{
				this.index ++  //当前索引加1
			}
		},
		_getWeizhi(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_jianhuo',
				'i':this.FNULLE([
				'opmode','Y_JTBH_qrywz',
				'kqid', this.ryuser.kqid,
				'czyid',this.ryuser.operatorid,
				])
				},'获取位置详情',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					_self.hqpList = rtn_json_obj
					console.log(rtn_json_obj)
					if(_self.hqpList.length > 0){
						_self.isHQVisible = true
					}else{
						_self.$toast.fail('暂无获取位置详情')
					}
				}
			});
		},
		_getSku(){
			if(this.editForm.cwno >''){

			}else{
				return this.$toast.fail('请先领取任务')
			}
			let sendData = {
				'kqid':this.ryuser.kqid,
				'czyid':this.ryuser.operatorid,
				'cwno':this.editForm.cwno,
				'storeid':this.editForm.storeid,
				'unit':this.editForm.unit,
				'whsid':this.editForm.whsid,
				'itemid':this.editForm.itemid,
				'subid':this.editForm.subid,
			}
			console.log(sendData)
				var _self = this;
				var ldemodata = [{retval:0, errmsg:'返回数据集'},]
				this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_y_jianhuo',
					'i':this.FNULLE([
					'opmode','Y_JTBH_qryitemid',
					'kqid', this.ryuser.kqid,
					'czyid',this.ryuser.operatorid,
					'cwno',this.editForm.cwno,
					'storeid',this.editForm.storeid,
					'unit',this.editForm.unit,
					'whsid',this.editForm.whsid,
					'itemid',this.editForm.itemid,
					'subid',this.editForm.subid,
           'tqty',this.editForm.tqty,
					])
					},'获取商品详情',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
					if(ret_iserr){ //传入的true参数,理论上不会有此回调了
						_self.$toast.fail('查询失败')
						_self.$store.commit('hideLoading');
					}else{
						var rtn_json_obj = null;
						_self.$store.commit('hideLoading');
						if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
						}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
						}
						console.log("得到商品详情")
						console.log(rtn_json_obj)
						_self.skuData = rtn_json_obj
						console.log("得到获取商品详情")
						console.log(rtn_json_obj[0])
						if(_self.skuData.length > 0){
							// _self.isSkuVisible = true
						}else{
							_self.$toast.fail('暂无获取商品详情')
						}
					}
				});
		},
		lingquBtn(){
			if(this.editForm.hqp > ''){

			}else{
				return this.$toast.fail('请先选择您的工作位置')
			}
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
				'method':'dgate',
				'pname':'f_wmsa_y_jianhuo',
				'i':this.FNULLE([
				'opmode','Y_JTBH_lqbill',
				'czyid',this.ryuser.operatorid,
				'kqid', this.ryuser.kqid,
				'q_no',this.editForm.q_no,
				'p_no',this.editForm.p_no,
				'route_c',this.editForm.route_c,
				])
				},'领取任务',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					_self.lingquData = rtn_json_obj
					_self.indexSku = _self.lingquData.length -1
					console.log("得到领取任务")
					console.log(rtn_json_obj)
					if(_self.lingquData.length > 0){
						_self.editForm.bill 		= _self.lingquData[0].bill
						_self.editForm.cwno 		= _self.lingquData[0].cwno
						_self.editForm.p_no 		= _self.lingquData[0].p_no
						_self.editForm.pack 		=	_self.lingquData[0].pack
						_self.editForm.q_no 		=	_self.lingquData[0].q_no
						_self.editForm.route_c 	= _self.lingquData[0].route_c
						_self.editForm.sort1 		= _self.lingquData[0].sort1
						_self.editForm.storeid 	= _self.lingquData[0].storeid
						_self.editForm.tqty 		= _self.lingquData[0].tqty
						_self.editForm.whsid 		= _self.lingquData[0].whsid
						_self.editForm.yjtotqty = _self.lingquData[0].yjtotqty
						_self.editForm.qty 			= _self.lingquData[0].qty
						_self.editForm.subid 		= _self.lingquData[0].subid
						_self.editForm.unit 		= _self.lingquData[0].unit
						_self.editForm.itemid 	= _self.lingquData[0].itemid
						_self._getSku();
						_self.$refs.inputField.focus();
					}else{
						_self.$toast.fail('暂无领取任务')
					}
				}
			});
		},
		selectSkuClick(row){
			this.editForm.jxcwno = row.jxcwno  //拣选仓位
			this.editForm.spcwlx = row.spcwlx  //商品类型
			this.editForm.subsname = row.subsname  //商品名称
			this.editForm.tkc = row.tkc  //库存量
			this.editForm.tkcfp = row.tkcfp  //已分配量
			this.editForm.username  = row.username  //单位
			this.isSkuVisible = false  //关闭商品列表
		},
		do_inputspbar(pmtxt){
			console.log(pmtxt)  //扫描枪获取的参数
			this.editForm.cwno_t = pmtxt
			// this.saveGoodsBtn()
		},
		saveGoodsBtn(){
			let sendData = {
				'kqid':this.ryuser.kqid,
				'czyid':this.ryuser.operatorid,
				'bill':this.editForm.bill,
				'cwno':this.editForm.cwno,
				'yjtotqty':this.editForm.yjtotqty,
				'storeid':this.editForm.storeid,
				'unit':this.editForm.unit,
				'pack':this.editForm.pack,
				'qty':this.editForm.qty,
				'whsid':this.editForm.whsid,
				'cwno_t':this.editForm.cwno_t,
				'unit':this.editForm.unit,
			}
			console.log(sendData)

				var _self = this;
				var ldemodata = [{retval:0, errmsg:'返回数据集'},]
				this.MYPOST({
						'method':'dgate',
						'pname':'f_wmsa_y_jianhuo',
						'i':this.FNULLE([
						'opmode','Y_JTBH_bhqr',
						'kqid', this.ryuser.kqid,
						'czyid',this.ryuser.operatorid,
						'cwno',this.editForm.cwno,
						'bill',this.editForm.bill,
						'yjtotqty',this.editForm.yjtotqty,
						'pack',this.editForm.pack,
						'qty',this.editForm.qty,
						'whsid',this.editForm.whsid,
						'cwno_t',this.editForm.cwno_t,
						'itemid',this.editForm.itemid,
						'subid',this.editForm.subid,
						'unit',this.editForm.unit,
						'storeid',this.editForm.storeid,
					])
					}, '静态补货',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
					if(ret_iserr){ //传入的true参数,理论上不会有此回调了
						_self.$toast.fail('查询失败')
						_self.$store.commit('hideLoading');
					}else{
						var rtn_json_obj = null;
						_self.$store.commit('hideLoading');
						if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
						}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
						}
						// _self.skuData = rtn_json_obj
						console.log("得到静态补货")
						console.log(rtn_json_obj[0])
						if(rtn_json_obj[0].ret_ret == '-1'){
							_self.$toast(rtn_json_obj[0].ret_mess)
						}else{
							_self.lingquBtn();
							_self.$toast(rtn_json_obj[0].ret_mess)
							_self.editForm.bill			= ''
							_self.editForm.jhrqid		= ''
							_self.editForm.cwno			= ''
							_self.editForm.yjtotqty	= ''
							_self.editForm.pack			= ''
							_self.editForm.qty			= ''
							_self.editForm.unit			= ''
							_self.editForm.itemid		= ''
							_self.editForm.subid		= ''
							_self.editForm.whsid		= ''
							_self.editForm.renwuid	= ''
							_self.editForm.cwno_t		= ''
							_self.editForm.route_c	= ''
							_self.editForm.route_c 	= ''
							_self.editForm.storeid 	= ''
							_self.editForm.tqty 		= ''
							_self.skuData = [
								{
									subsname:'',
								}
							]
						}
					}
				});
		},
		overBtn(){
			var _self = this;
			var ldemodata = [{retval:0, errmsg:'返回数据集'},]
			this.MYPOST({
					'method':'dgate',
					'pname':'f_wmsa_jianhuo',
					'i':this.FNULLE([
					'opmode','PTJH_jsrq',
					'kqid', this.ryuser.kqid,
					'czyid',this.ryuser.operatorid,
					'jhrqid', this.editForm.jhrqid,
				])
				}, '确认拣货',true, ldemodata, function(ret_obj, ret_iserr,ret_errmess,ret_oldresp){
				if(ret_iserr){ //传入的true参数,理论上不会有此回调了
					_self.$toast.fail('查询失败')
					_self.$store.commit('hideLoading');
				}else{
					var rtn_json_obj = null;
					_self.$store.commit('hideLoading');
					if(ret_obj != null){ rtn_json_obj = ret_obj; //返回的接口可以直接解析的情况
					}else{  rtn_json_obj = _self.arr2Obj(ret_oldresp.data); //非标准的dgate接口,返回的一个不兼容的处理
					}
					// _self.skuData = rtn_json_obj
					console.log("得到确认拣货")
					console.log(rtn_json_obj[0])
					if(rtn_json_obj[0].ret_ret == '-1'){
						_self.$toast(rtn_json_obj[0].ret_mess)
					}else{
						_self.$toast(rtn_json_obj[0].ret_mess)
						_self.editForm.jhrqid	= ''
					}
				}
			});
		},
  },
  mounted() {

  },
	components: {

	},
};
</script>

<style lang="scss" scoped>
	// 引入公共样式
	@import '@/assets/css/base.scss';
	@import '@/assets/css/input.scss';
	div.zhengtuojianhuo{
		padding-top: 50px;
	}

	div.chongfu{
		font-size: 20px;
		font-weight: bold;
		margin-bottom:5px;
	}
</style>
